<%--
  Created by IntelliJ IDEA.
  User: wagger
  Date: 2019/05/22
  Time: 下午 10:14
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>Register</title>
    <link rel="stylesheet" href="/client/css/auth.css">
    <link rel="shortcut icon" href="/client/images/tou.ico">
</head>

<body style="background: url('/client/images/user/bg.jpg')">
<div class="lowin">
    <div class="lowin-brand">
        <img src="/client/images/user/kodinger.jpg" alt="logo">
    </div>
    <div class="lowin-wrapper">

        <div class="lowin-box lowin-register">
            <div class="lowin-box-inner">
                <form id="myform1" action="/user/regist.do">
                    <p>创建一个账号</p>
                    <div style="text-align: center"><h3 style="color: red">${msg}</h3></div>
                    <div class="lowin-group">
                        <label>用户名</label>
                        <div><span style="color: red" id="namemsg"></span></div>
                        <input type="text" autocomplete="email" name="username" class="lowin-input" id="username" onblur="checkName()">
                    </div>
                    <div class="lowin-group">
                        <label>密码</label>
                        <div><span style="color: red" id="passwordmsg"></span></div>
                        <input type="password" name="password" autocomplete="current-password" class="lowin-input" id="password" onblur="checkPassword()">
                    </div>
                    <%--<div class="lowin-group">--%>
                        <%--<label>确认密码</label>--%>
                        <%--<div><span style="color: red" id="repasswordmsg"></span></div>--%>
                        <%--<input type="password" name="repassword" autocomplete="current-password" class="lowin-input" id="repassword" onblur="checkRepassword()">--%>
                    <%--</div>--%>
                    <button class="lowin-btn" type="button" onclick="checkRegist()">
                        注册
                    </button>

                    <div class="text-foot">
                        已经拥有账号？ <a href="/client/login.jsp" class="login-link">登录</a>
                    </div>
                </form>
            </div>
        </div>


    </div>

    <footer class="lowin-footer">
        wagger208@foxmail.com
    </footer>
</div>

<script src="/client/js/auth.js"></script>
<script src="/client/js/jquery-2.1.4.min.js"></script>
<script>
    function checkName() {
        var username = $("#username").val();
        var msg=$("#namemsg");
        if (username== null || username ==""){
            msg.html("用户名不能为空");
            msg.css({"color": "red"});
            return false;
        }

        $.ajax({
            url: "/user/checkUser.do",
            type: "POST",
            data: "username=" + username,
            dataType: "json",
            success: function (data) {
                if (data.flag == true) {
                    msg.html(username + "可以注册");
                    msg.css({"color": "green"});
                } else {
                    msg.html("用户名已经存在");
                    msg.css({"color": "red"})
                }
            }
        })
    }
    function checkRegist() {
        var password = $("#password").val();
        var msg = $("#passwordmsg");
        if (password == null || password == "") {
            msg.html("密码不能为空");
            msg.css({"color": "red"});
            return false;
        }else {
            msg.html("");
        }
        $("#myform1").submit();
    }
    // function checkRepassword() {
    //     var repassword = $("#repassword").val();
    //     var password = $("#password").val();
    //     var msg = $("#repasswordmsg");
    //     if (repassword == null || repassword == "") {
    //         msg.html("密码不能为空");
    //         msg.css({"color": "red"});
    //         return false;
    //     }
    //     if(password != repassword){
    //         msg.html("2次密码不一样");
    //         msg.css({"color": "red"});
    //         return false;
    //     }else {2
    //         return true;
    //     }
    // }
</script>
</body>
